.index {
  padding-bottom: 120px;
  &.musicbox {
    padding-bottom: 220px;
  }
}
.banner {
  height: 375px;
  margin-top: 20px;
  &-img {
    width: 92%;
    height: 375px;
    position: relative;
    left: 4%;
    border-radius: 20px;
  }
}
.card {
  &-item {
    padding: 20px;
    text-align: center;
  }
  &-col {
    background-color: #d43c33;
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    margin: 0 auto;
  }
}
.play {
  &-item {
    width: 31%;
    margin: 0 1% 30px;
    border-radius: 12px;
  }
  &-contain {
    padding: 10px 30px;
  }
  &-imgbox {
    display: block;
    width: 100%;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0px 0px 20px #8f8f8f;
    position: relative;
  }
  &-count {
    font-size: 20px;
    position: absolute;
    right: 10px;
    top: 0;
    font-weight: 700;
    z-index: 3;
    display: flex;
    align-items: center;
    color: #fff;
  }
  &-name {
    -webkit-box-orient: vertical;
    margin-top: 10px;
    height: 72px;
  }
}
